<template>
    <TabPane 
        :name="name"
        :label="label"
        :icon="icon"
        :disabled="disabled"
        :closable="closable"
        :tab="tab"
        :index="index"
        :contextMenu="contextMenu"
    >
        <slot></slot>
    </TabPane>
</template>
<script>
export default {
    name: 'cvu-tab-pane',
    props: {
        // 用于标识当前面板，对应 value，默认为其索引值
        name: String,
        // 选项卡头显示文字，支持 Render 函数
        label: [String, Function],
        // 选项卡图标
        icon: String,
        // 是否禁用该选项卡
        disabled: {
            type: Boolean,
            default: false
        },
        // 是否可以关闭页签，仅在 type="card" 时有效
        closable: {
            type: Boolean,
            default: null
        },
        // Tabs 嵌套时，用 tab 区分层级，指向对应的 Tabs 的 name
        tab: {
            type: String
        },
        // 在 TabPane 使用 v-if 时，并不会按照预先的顺序渲染，这时可设置 index，并从小到大排序
        // 数值需大于 0
        index: {
            type: Number
        },
        // 是否支持右键菜单
        contextMenu: {
            type: Boolean,
            default: false
        }
    }
}
</script>
<style lang="scss" scoped>
    @import '../../../style/_index.scss';
</style>